<template>
  <div class="w-64 bg-dark text-white h-screen fixed">
    <nav class="p-4">
      <ul>
        <li 
          v-for="item in navItems" 
          :key="item.id" 
          class="mb-4 hover:bg-gray-700 p-2 rounded transition-colors cursor-pointer"
        >
          {{ item.name }}
        </li>
      </ul>
    </nav>
  </div>
</template>

<script setup>
const navItems = [
  { id: 1, name: '2D原画' },
  { id: 2, name: '3D模型' },
  { id: 3, name: '视频生成' },
  { id: 4, name: '2D动效' },
  { id: 5, name: '策划文案' },
  { id: 6, name: '程序代码' },
  { id: 7, name: '音乐音效' },
];
</script>